<template>
	<view class="content">
		<u-navbar background="#F8F8F8;" title="搜索"></u-navbar>
		<u-search @custom="search" @search="search" :clearabled="false" margin="20rpx" bg-color="#ffffff"
			placeholder="输入你想找的用户/作品的ID"></u-search>
		<view class="main">
			<card-list v-for="(item, index) in config" :key="index" :config="item"></card-list>
			<u-loadmore :status="status" icon-type="flower" :load-text="loadText" />
		</view>
	</view>
</template>

<script>
	let skip = 0
	export default {
		data() {
			return {
				config: [],
				status: 'loadmore',
				loadText: {
					loadmore: '没有内容',
					loading: '努力加载中',
					nomore: '没有更多了',
				}
			}
		},
		onReachBottom() {
			if (this.status == "loading") {
				skip += 10
				this.getTemplate()
			} else {
				this.status = "nomore"
			}
		},
		methods: {
			search(e) {
				this.status = "loading"
				skip = 0
				if (e.length === 32) {
					// 搜索作品id
					wx.cloud.callFunction({
						name: 'getTemplate',
						data: {
							_id: e,
							action: 'getTempitem'
						},
						success: res => {
							this.config.push(res.result.data)
							this.status = "nomore"
						},
						fail: err => console.log("search错误：", err)
					})
				} else {
					// 搜索用户
					this.getTemplate(e)
				}
			},
			async getTemplate(e) {
				wx.cloud.callFunction({
					name: "getTemplate",
					data: {
						skip,
						nickName: e,
						action: 'getNamelist'
					},
					success: res => {
						this.config.push(...res.result.data)
						console.log(this.config);
						this.$u.toast(`获取到${res.result.data.length}条`)
						if (res.result.data.length == 0 || res.result.data.length < 10) {
							this.status = 'nomore'
						} else {
							this.status = "loading"
						}
					},
					fail: err => console.log("getTemplate出错：", err)
				})
			}
		}
	}
</script>

<style>
	page {
		background-color: #F8F8F8;
	}

	.main {
		width: 710rpx;
		padding: 0 20rpx;
	}
</style>
